<template>
	<div class="petsRecord navBar">
		<van-sticky>
			<van-nav-bar left-arrow :title="$route.meta.title"  @click-left="$routerBack" />
		</van-sticky>
		
		<div class="pets_log">
			<div v-if="pets_log === ''" style="text-align: center;padding-top: 2rem;">
				<van-loading size="24px">加载中...</van-loading>
			</div>
			<div class="pl_item" v-for="item,index in pets_log" :key="index">
				<div>
					<span>预约{{item.dws.name}}</span>
					<span>消耗：{{item.jf_nums}}</span>
				</div>
				<p>预约时间：{{item.time1}}</p>
			</div>
			<div v-if="pets_log.length <= 0 && pets_log !== ''" style="text-align: center;padding-top: 2rem;">
				<p style="color: rgba(255,255,255,.5);font-size: .28rem;">暂无数据</p>
			</div>
		</div>
	</div>
</template>

<script>
	export default{
		name:"petsRecord",
		async created(){
			
			try{
				
				const data = await this.$apis.Pets.yuyueLog()
				
				this.pets_log = data.data
				
			}catch(e){
				//TODO handle the exception
			}
			
		},
		data(){
			return{
				
				pets_log:""
				
			}
		}
	}
</script>

<style lang="less" scoped>
	@import '../../style/navBar.less';
	
	.petsRecord{
		
		.pets_log{
			
			.pl_item{
				border-bottom: 1px solid rgba(255,255,255,.1);
				font-size: .3rem;
				color: #94E9FF;
				padding: .4rem;
				box-sizing: border-box;
				
				>div:nth-child(1){
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-bottom: .18rem;
				}
				
				p{
					font-size: .24rem;
				}
			}
		}
	}
</style>
